<div class="container page">
  <div class="row">

    <div class="col-md-6 offset-md-3 col-xs-12">
      <h1 class="text-xs-center">Your Settings</h1>

      <form submit.trigger="$event.preventDefault()">
        <fieldset>
          <fieldset class="form-group">
            <input class="form-control" type="text" placeholder="URL of profile picture" value.bind="local.image"
              name="image">
          </fieldset>
          <fieldset class="form-group">
            <input class="form-control form-control-lg" type="text" placeholder="Your Name" value.bind="local.username"
              autocomplete="name" name="username">
          </fieldset>
          <fieldset class="form-group">
            <textarea class="form-control form-control-lg" rows="8" placeholder="Short bio about you"
              value.bind="local.bio" name="bio"></textarea>
          </fieldset>
          <fieldset class="form-group">
            <input class="form-control form-control-lg" type="text" placeholder="Email" value.bind="local.email"
              autocomplete="email" name="email">
          </fieldset>
          <fieldset class="form-group">
            <input class="form-control form-control-lg" type="password" placeholder="Password"
              value.bind="local.password" autocomplete="current-password" name="password">
          </fieldset>
          <button class="btn btn-lg btn-primary pull-xs-right" click.delegate="update()" data-e2e="updateBtn">
            Update Settings
          </button>
        </fieldset>
      </form>

      <hr>
      <button class="btn btn-outline-danger" click.delegate="logout()">
        Or click here to logout.
      </button>
    </div>

  </div>

</div>
</div>
